<div class="modal-dialog" style="width: 1275px;">
	<div class="modal-content" style="width: 1221px; height: 600px;">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal">&times;</button>
			<h4 class="modal-title">Preview Data</h4>
		</div>
		<input id="nama_data" value="<?php echo $kuesioner[0]['nama_kuesioner']?>" style="display:none">
		<div class="modal-body" id="kolom_data" style="overflow: scroll; width: 100%; height: 70%;">
				<table class="table" >
				<?php
				if(!empty($data_responden))
				{
					$nomor = 1;
					echo '<tr>';
					echo '<th>No.</th>';
					foreach($pertanyaan as $pertanyaan)
					{
						echo '<th>'.$pertanyaan['pertanyaan'].'</th>';	
					}
					echo '</tr>';
					
					foreach($data_responden as $responden)
					{
					echo '<tr>';
					echo '<td>'.$nomor++.'</td>';
						foreach($responden['data_jawaban'] as $jawaban)
						{
							echo '<td>'.$jawaban['jawaban'].'</td>';
						}
					echo '</tr>';
					}
				} else
					{
						echo 'belum ada data responden';
					}
				?>
				</table>
		</div>
		<div class="modal-footer">
			<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
			<?php
			if(!empty($data_responden))
			{
			?>
			<input type="button" class="btn btn-primary" data-dismiss="modal" id="btndownload" value="Download">		
			<?php
			}
			?>
		</div>
	</div>
</div>
		
		
<script>
$("#btndownload").click(function(e) {
		//getting values of current time for generating the file name
		var nama_data = $('#nama_data').val();
		var dt = new Date();
		var day = dt.getDate();
		var month = dt.getMonth() + 1;
		var year = dt.getFullYear();
		var hour = dt.getHours();
		var mins = dt.getMinutes();
		var postfix = day + "." + month + "." + year + "_" + hour + "." + mins;
		//creating a temporary HTML link element (they support setting file names)
		var a = document.createElement('a');
		//getting data from our div that contains the HTML table
		var data_type = 'data:application/vnd.ms-excel';
		var table_div = document.getElementById('kolom_data');
		var table_html = table_div.outerHTML.replace(/ /g, '%20');
		a.href = data_type + ', ' + table_html;
		//setting the file name
		a.download = nama_data+'.xls';
		//triggering the function
		a.click();
		//just in case, prevent default behaviour
		e.preventDefault();
	});

	/*$("#btndownload").click(function(e) {
    window.open('data:application/vnd.ms-excel;filename=filename.txt,' + encodeURIComponent($('#kolom_data').html()));
    e.preventDefault();
});*/
</script>